<script lang="ts" setup>
interface Props {
  // 可选参数 ? 
  text?: string
}

// 在 Vue 3.5+ 版本，可通过解构赋值设置默认值
const {text='按钮'}  = defineProps<Props>()

// 在 Vue 3.4 及更低版本，需使用 withDefaults 设置默认值
// const props = withDefaults(
//   defineProps<Props>(), 
//   {text: '按钮'}
//   )
</script>

<template>
  <button class="btn">{{text}}</button>
</template>

<style scoped>
.btn {
  background-color:  blueviolet;
  color: #fff;
  padding: 10px;
  /* 边框 */
  border: none; 
  border-radius: 5px;
}
</style>